<template>
    <div class="detail">
        <!-- <el-row>
            <el-col :span="4"
                ><div class="grid-content bg-purple">
                    {{ '期限:' + (bondDetailInfo.issueTerm ? bondDetailInfo.issueTerm + '年' : '--') }}
                </div>
            </el-col>
            <el-col :span="5"
                ><div class="grid-content bg-purple">
                    票面利率：{{ bondDetailInfo.yearRate != undefined ? numberFormat(bondDetailInfo.yearRate, 2) + '%' : '' }}
                </div></el-col
            >
            <el-col :span="5"
                ><div class="grid-content bg-purple">
                    发行规模： {{ bondDetailInfo.totalBalance != undefined ? numberFormat(bondDetailInfo.totalBalance, 2) + '亿' : '0' }}
                </div></el-col
            >
            <el-col :span="5"
                ><div class="grid-content bg-purple">{{ '内部主体评级：' + '未评级' }}</div></el-col
            >
            <el-col :span="5"
                ><div class="grid-content bg-purple">
                    {{ bondDetailInfo.bidSubject ? (bondDetailInfo.bidSubject == 1 ? '利率区间:' : '价格区间:') : '' }}
                </div></el-col
            >
        </el-row>
        <el-divider></el-divider> -->
        <div>
            <span style="font-size:30px;color:#409EFF">{{ bondDetailInfo.bondNameSt }}</span>
            <div class="title">
                <span class="title-item">
                    {{ bondDetailInfo.issueTerm ? '期限：' + bondDetailInfo.issueTerm + '年' : '期限： ' }}
                </span>
                <span class="title-item"
                    >票面利率：{{ bondDetailInfo.yearRate != undefined ? numberFormat(bondDetailInfo.yearRate, 2) + '%' : '' }}</span
                >
                <span class="title-item"
                    >发行规模：{{ bondDetailInfo.totalBalance != undefined ? numberFormat(bondDetailInfo.totalBalance, 2) + '亿' : '0' }}</span
                >
                <span class="title-item">招标标的：{{ bondDetailInfo.bidSubject ? bidSubjectPojo[bondDetailInfo.bidSubject] : '--' }}</span>

                <span class="title-item" v-if="bondDetailInfo.bidSubject == 1">
                    利率区间：<span v-if="bondDetailInfo.bidSectionLower || bondDetailInfo.bidSectionUpper">
                        <span style="font-size: 18px;">{{
                            (bondDetailInfo.bidSectionLower ? numberFormat(bondDetailInfo.bidSectionLower, 2) : '--') + '%'
                        }}</span>
                        <span class="connect-line"></span>
                        <span style="font-size: 18px;">{{
                            (bondDetailInfo.bidSectionUpper ? numberFormat(bondDetailInfo.bidSectionUpper, 2) : '--') + '%'
                        }}</span>
                        <!-- {{
                            bondDetailInfo.bidSubject
                                ? (bondDetailInfo.bidSubject == 1 ? '利率区间:' : '价格区间:') + (bondDetailInfo.bidSection || '--')
                                : ''
                        }} -->
                    </span>
                    <span v-else>--</span>
                </span>
                <span class="title-item" v-else>
                    价格区间：<span v-if="bondDetailInfo.bidSectionLower || bondDetailInfo.bidSectionUpper">
                        <!-- <span style="font-size: 18px;">{{ (bondDetailInfo.bidSectionLower || '--') + '元' }}</span> -->
                        <span style="font-size: 18px;">{{
                            (bondDetailInfo.bidSectionLower ? numberFormat(bondDetailInfo.bidSectionLower, 2) : '--') + '元'
                        }}</span>
                        <span class="connect-line"></span>
                        <span style="font-size: 18px;">{{
                            (bondDetailInfo.bidSectionUpper ? numberFormat(bondDetailInfo.bidSectionUpper, 2) : '--') + '元'
                        }}</span>
                        <!-- <span style="font-size: 18px;">{{ (bondDetailInfo.bidSectionUpper || '--') + '元' }}</span> -->
                    </span>
                    <span v-else>--</span>
                </span>
            </div>

            <el-divider></el-divider>
        </div>

        <el-row>
            <el-form ref="form" :model="bondDetail" label-width="140px">
                <el-row>
                    <el-col :span="6">
                        <el-form-item prop="bondCode">
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>债券代码</span>
                            </span>
                            <el-input
                                type="text"
                                @input="handleInputChange($event, 'bondCode')"
                                placeholder="例如：99ET87 SS"
                                v-model="bondDetailInfo.bondCode"
                                size="mini"
                                :title="bondDetailInfo.bondCode"
                                :disabled="type !== 'add'"
                                @change="handleChangeBondCode"
                            ></el-input>
                            <span v-show="type == 'add'" style="float: right;z-index: 10;margin-right: -20px;position: absolute;right: 0px;">
                                <el-popover popper-class="popper" placement="top" title="" width="fit-content" trigger="hover">
                                    <span style="margin: 10px 5px">{{ '后缀支持YH，SZ，SS' }}</span>
                                    <span slot="reference" class="label-icon">?</span>
                                </el-popover>
                            </span>
                        </el-form-item>
                        <el-form-item label="利率类型">
                            <el-select clearable size="mini" v-model="bondDetailInfo.inType" filterable :disabled="disabledStatus">
                                <el-option v-for="(value, key) in inType" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>发行规模</span>
                            </span>
                            <RiskInputNumber2
                                :maxlength="4"
                                :input="bondDetailInfo.totalBalance"
                                :inputAfter="'亿'"
                                :precision="2"
                                :field="'totalBalance'"
                                :disabled="disabledStatus"
                                @getInputNumber="getInputNumber(arguments)"
                            >
                            </RiskInputNumber2>
                            <!-- <el-input
                                    placeholder="请输入"
                                    v-model="bondDetailInfo.totalBalance"
                                    size="mini"
                                    :title="bondDetailInfo.totalBalance"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>招标标的</span>
                            </span>
                            <el-select
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.bidSubject"
                                :disabled="disabledStatus"
                                @change="handleSujectChange"
                            >
                                <el-option v-for="(value, key) in bidSubjectPojo" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="主体外部评级">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.compGrade" placeholder="请选择" :disabled="true">
                                <el-option v-for="item in dictGradeCode" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                            <!-- <el-input :value="bondDetailInfo.compGrade" size="mini" :title="bondDetailInfo.compGrade" :disabled="true"></el-input> -->
                        </el-form-item>
                        <el-form-item label="债项内部评级">
                            <el-select
                                size="mini"
                                v-model="bondDetailInfo.debtInnerRating"
                                placeholder="请选择"
                                :disabled="disabledStatus"
                                filterable
                            >
                                <el-option
                                    v-for="(item, index) in dictInnerGradeCode"
                                    :key="item.dictKey + index"
                                    :label="item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                            <!-- <el-input size="mini" value="未评级" placeholder="未评级" title="未评级" :disabled="true"></el-input> -->
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>投标开始日期</span>
                            </span>
                            <el-date-picker
                                :title="bondDetailInfo.bidStartDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.bidStartDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                            <!-- <el-input
                                    v-model="bondDetailInfo.bidStartDate"
                                    size="mini"
                                    :title="bondDetailInfo.bidStartDate"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>缴款日期</span>
                            </span>
                            <el-date-picker
                                :title="bondDetailInfo.payDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.payDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="副承销商">
                            <el-tooltip
                                effect="dark"
                                placement="top-start"
                                :disabled="bondDetailInfo.duwrtName2 && !bondDetailInfo.duwrtName2.length"
                            >
                                <ul slot="content" style="min-height: 18px; max-height: 200px; overflow: auto">
                                    <li :key="item.dictKey" v-for="item in bondDetailInfo.duwrtName2">
                                        {{ item.dictKey + ' ' + item.dictKeyName }}
                                    </li>
                                </ul>
                                <el-select
                                    filterable
                                    :filter-method="queryDruwt"
                                    clearable
                                    size="mini"
                                    multiple
                                    collapse-tags
                                    v-model="bondDetailInfo.duwrtName2"
                                    placeholder="请选择"
                                    :disabled="disabledStatus"
                                    value-key="dictKey"
                                >
                                    <el-option v-for="(item, index) in dictDuwrt" :key="item.dictKey + index" :label="item.dictKeyName" :value="item">
                                    </el-option>
                                </el-select>
                            </el-tooltip>
                            <!-- <el-input v-model="duwrtName2" size="mini" :title="duwrtName2" :disabled="disabledStatus"></el-input> -->
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item prop="bondNameSt">
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>债券简称</span>
                            </span>
                            <el-input
                                placeholder="请输入"
                                @input="handleInputChange($event, 'bondNameSt')"
                                v-model="bondDetailInfo.bondNameSt"
                                size="mini"
                                :title="bondDetailInfo.bondNameSt"
                                :disabled="disabledStatus"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="票面利率" prop="bondNameSt">
                            <!-- <el-input
                                    placeholder="请输入"
                                    v-model="bondDetailInfo.yearRate"
                                    size="mini"
                                    :title="bondDetailInfo.yearRate"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                            <RiskInputNumber2
                                :maxValue="100"
                                :maxlength="3"
                                :input="bondDetailInfo.yearRate"
                                :inputAfter="'%'"
                                :precision="2"
                                :field="'yearRate'"
                                :disabled="disabledStatus"
                                @getInputNumber="getInputNumber(arguments)"
                            >
                            </RiskInputNumber2>
                        </el-form-item>
                        <el-form-item label="交易市场">
                            <el-select
                                filterable
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.marketCode"
                                placeholder="请选择"
                                :disabled="type !== 'add'"
                                @change="handleMarketCodeChange"
                            >
                                <el-option v-for="item in marketCodePojo" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                            <!-- <el-input
                                    :value="bondDetailInfo.marketName"
                                    size="mini"
                                    :title="bondDetailInfo.marketName"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                        </el-form-item>
                        <el-form-item :class="computedClass" :label="bondDetailInfo.bidSubject == '1' ? '利率区间' : '价格区间'" class="suffix-box">
                            <RiskInputNumber2
                                style="width: 76px; display: inline-block"
                                :maxValue="100"
                                :maxlength="3"
                                :input="bondDetailInfo.bidSectionLower"
                                :inputAfter="bondDetailInfo.bidSubject == '1' ? '%' : '元'"
                                :precision="2"
                                :field="'bidSectionLower'"
                                :disabled="sectionDisabledStatus"
                                @getInputNumber="getInputNumber(arguments)"
                            >
                            </RiskInputNumber2>
                            <span class="connect-line"></span>
                            <RiskInputNumber2
                                style="width: 76px;; display: inline-block"
                                :maxValue="100"
                                :maxlength="3"
                                :input="bondDetailInfo.bidSectionUpper"
                                :inputAfter="bondDetailInfo.bidSubject == '1' ? '%' : '元'"
                                :precision="2"
                                :field="'bidSectionUpper'"
                                :disabled="sectionDisabledStatus"
                                @getInputNumber="getInputNumber(arguments)"
                            >
                            </RiskInputNumber2>
                            <!-- <div v-if="bondDetailInfo.bidSubject == '1'">
                                <RiskInputNumber2
                                    style="width: 81px; display: inline-block"
                                    :maxValue="100"
                                    :maxlength="3"
                                    :input="bondDetailInfo.bidSectionLower"
                                    :inputAfter="'%'"
                                    :precision="2"
                                    :field="'bidSectionLower'"
                                    :disabled="sectionDisabledStatus"
                                    @getInputNumber="getInputNumber(arguments)"
                                >
                                </RiskInputNumber2>
                                <span class="connect-line"></span>
                                <RiskInputNumber2
                                    v-if="bondDetailInfo.bidSubject == '1'"
                                    style="width: 81px;; display: inline-block"
                                    :maxValue="100"
                                    :maxlength="3"
                                    :input="bondDetailInfo.bidSectionUpper"
                                    :inputAfter="'%'"
                                    :precision="2"
                                    :field="'bidSectionUpper'"
                                    :disabled="sectionDisabledStatus"
                                    @getInputNumber="getInputNumber(arguments)"
                                >
                                </RiskInputNumber2>
                            </div>
                            <div v-else style="display: flex; align-items: center;margin-top: 4px">
                                <el-input
                                    class="input-suffix"
                                    v-model="bondDetailInfo.bidSectionLower"
                                    :disabled="sectionDisabledStatus"
                                    :title="bondDetailInfo.bidSectionLower"
                                    size="mini"
                                    @change="handleSectionChange"
                                >
                                    <template slot="append">元</template>
                                </el-input>
                                <span class="connect-line"></span>
                                <el-input
                                    class="input-suffix"
                                    v-model="bondDetailInfo.bidSectionUpper"
                                    :disabled="sectionDisabledStatus"
                                    :title="bondDetailInfo.bidSectionUpper"
                                    size="mini"
                                    @change="handleSectionChange"
                                >
                                    <template slot="append">元</template>
                                </el-input>
                            </div> -->
                        </el-form-item>
                        <el-form-item label="主体外部评级机构">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.gradeComp" placeholder="请选择" :disabled="true">
                                <el-option v-for="item in dictOuterIssue" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                            <!-- <el-input v-model="bondDetailInfo.gradeComp" size="mini" :title="bondDetailInfo.gradeComp" :disabled="true"></el-input> -->
                        </el-form-item>
                        <!-- <el-form-item label="主体内部评级">
                            <el-input size="mini" value="未评级" placeholder="未评级" title="未评级" :disabled="true"></el-input>
                        </el-form-item> -->
                        <el-form-item label="债券内部评级展望">
                            <el-select
                                filterable
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.ratingOutlook"
                                placeholder="请选择"
                                :disabled="disabledStatus"
                            >
                                <el-option v-for="item in ratingOutlookPojo" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                            <!-- <el-input size="mini" value="无评级展望" placeholder="无评级展望" title="无评级展望" :disabled="true"></el-input> -->
                        </el-form-item>
                        <!-- <el-form-item label="内部评级展望">
                            <el-input size="mini" value="无评级展望" placeholder="无评级展望" title="无评级展望" :disabled="true"></el-input>
                        </el-form-item> -->
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>投标开始时间</span>
                            </span>

                            <el-time-picker
                                size="mini"
                                placeholder="请选择"
                                v-model="bondDetailInfo.bidingTime"
                                :title="bondDetailInfo.bidingTime"
                                :disabled="disabledStatus"
                                value-format="HHmm"
                                format="HH:mm"
                            >
                            </el-time-picker>
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>起息日期</span>
                            </span>
                            <el-date-picker
                                :title="bondDetailInfo.inStDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.inStDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="承销团">
                            <el-tooltip
                                effect="dark"
                                placement="top-start"
                                :disabled="bondDetailInfo.duwrtName3 && !bondDetailInfo.duwrtName3.length"
                            >
                                <ul slot="content" style="min-height: 18px; max-height: 200px; overflow: auto">
                                    <li :key="item.dictKey" v-for="item in bondDetailInfo.duwrtName3">
                                        {{ item.dictKey + ' ' + item.dictKeyName }}
                                    </li>
                                </ul>
                                <el-select
                                    filterable
                                    :filter-method="queryDruwt"
                                    clearable
                                    size="mini"
                                    multiple
                                    collapse-tags
                                    v-model="bondDetailInfo.duwrtName3"
                                    placeholder="请选择"
                                    :disabled="disabledStatus"
                                    value-key="dictKey"
                                >
                                    <el-option v-for="(item, index) in dictDuwrt" :key="item.dictKey + index" :label="item.dictKeyName" :value="item">
                                    </el-option>
                                </el-select>
                            </el-tooltip>
                            <!-- <el-input v-model="duwrtName3" size="mini" :title="duwrtName3" :disabled="disabledStatus"></el-input> -->
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>债券类型</span>
                            </span>
                            <el-select
                                filterable
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.bondType"
                                placeholder="请选择"
                                :disabled="disabledStatus"
                            >
                                <el-option v-for="item in allStockType" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="付息频率">
                            <el-select clearable size="mini" v-model="bondDetailInfo.paymentMode" :disabled="disabledStatus">
                                <el-option v-for="(value, key) in paymentMode" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="托管机构">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.localCustodian" :disabled="disabledStatus">
                                <el-option v-for="(value, key) in localCustodian" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="发行主体">
                            <el-select
                                :title="showIssue"
                                filterable
                                remote
                                :remote-method="queryIssueCodeList"
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.issueCode"
                                placeholder="请选择"
                                @change="getIssueInfo"
                                :disabled="disabledStatus"
                            >
                                <el-option
                                    v-for="item in issueCodeList"
                                    :key="item.dictKey"
                                    :label="item.dictKey + ' ' + item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="主体内部评级">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.compInnerGrade" :disabled="disabledStatus">
                                <el-option
                                    v-for="(item, index) in dictCompInnerGrade"
                                    :key="item.dictKey + index"
                                    :label="item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <!-- <el-form-item label="主体行业分类">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.issueType" :disabled="true" :title="showIssueType">
                                <el-option
                                    v-for="(item, index) in issueType2"
                                    :key="item.dictKey + index"
                                    :label="item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                           
                        </el-form-item> -->
                        <el-form-item label="公告日期">
                            <el-date-picker
                                :title="bondDetailInfo.publishDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.publishDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>投标截止日期</span>
                            </span>
                            <el-date-picker
                                :title="bondDetailInfo.bidEndDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.bidEndDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="到期日期">
                            <el-date-picker
                                :title="bondDetailInfo.enDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.enDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="计息方式">
                            <el-select clearable size="mini" v-model="bondDetailInfo.payType" :disabled="disabledStatus">
                                <el-option v-for="(value, key) in payType" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>期限</span>
                            </span>
                            <RiskInputNumber2
                                :disabled="disabledStatus"
                                :maxlength="15"
                                :input="bondDetailInfo.issueTerm"
                                :inputAfter="'年'"
                                :precision="2"
                                :field="'issueTerm'"
                                @getInputNumber="getInputNumber(arguments)"
                            >
                            </RiskInputNumber2>
                            <!-- <el-input
                                    placeholder="请输入"
                                    v-model="bondDetailInfo.issueTerm"
                                    size="mini"
                                    :title="bondDetailInfo.issueTerm"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                        </el-form-item>
                        <el-form-item label="招标方式">
                            <el-select clearable size="mini" v-model="bondDetailInfo.bidMode" :disabled="disabledStatus">
                                <el-option v-for="(value, key) in bidMode" :key="key" :value="key" :label="value"></el-option>
                            </el-select>
                        </el-form-item>
                        <!-- <el-form-item label="评级机构">
                            <el-input v-model="bondDetailInfo.gradeComp" size="mini" :title="bondDetailInfo.gradeComp" :disabled="true"></el-input>
                        </el-form-item> -->
                        <el-form-item label="主体行业分类">
                            <el-select filterable clearable size="mini" v-model="bondDetailInfo.issueType" :disabled="true" :title="showIssueType">
                                <el-option
                                    v-for="(item, index) in issueType2"
                                    :key="item.dictKey + index"
                                    :label="item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="债项外部评级">
                            <el-select
                                filterable
                                clearable
                                size="mini"
                                v-model="bondDetailInfo.debtRating"
                                placeholder="请选择"
                                :disabled="disabledStatus"
                            >
                                <el-option v-for="item in dictGradeCode" :key="item.dictKey" :label="item.dictKeyName" :value="item.dictKey">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>上市日期</span>
                            </span>
                            <el-date-picker
                                :title="bondDetailInfo.listDate"
                                :disabled="disabledStatus"
                                size="mini"
                                v-model="bondDetailInfo.listDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyyMMdd"
                                placeholder="选择日期"
                            >
                            </el-date-picker>
                            <!-- <el-input
                                    v-model="bondDetailInfo.listDate"
                                    size="mini"
                                    :title="bondDetailInfo.listDate"
                                    :disabled="disabledStatus"
                                ></el-input> -->
                        </el-form-item>
                        <el-form-item>
                            <span slot="label">
                                <i class="icon-prefix">*</i>
                                <span>投标截止时间</span>
                            </span>
                            <el-time-picker
                                size="mini"
                                placeholder="请选择"
                                v-model="bondDetailInfo.bidEndTime"
                                :title="bondDetailInfo.bidEndTime"
                                :disabled="disabledStatus"
                                value-format="HHmm"
                                format="HH:mm"
                                @change="test"
                            >
                            </el-time-picker>
                        </el-form-item>
                        <el-form-item label="主承销商">
                            <el-tooltip
                                effect="dark"
                                placement="top-start"
                                :disabled="bondDetailInfo.duwrtName1 && !bondDetailInfo.duwrtName1.length"
                            >
                                <ul slot="content" style="min-height: 18px; max-height: 200px; overflow: auto">
                                    <li :key="item.dictKey" v-for="item in bondDetailInfo.duwrtName1">
                                        {{ item.dictKey + ' ' + item.dictKeyName }}
                                    </li>
                                </ul>
                                <el-select
                                    size="mini"
                                    filterable
                                    :filter-method="queryDruwt"
                                    clearable
                                    multiple
                                    collapse-tags
                                    v-model="bondDetailInfo.duwrtName1"
                                    placeholder="请选择"
                                    :disabled="disabledStatus"
                                    value-key="dictKey"
                                >
                                    <el-option v-for="(item, index) in dictDuwrt" :key="item.dictKey + index" :label="item.dictKeyName" :value="item">
                                    </el-option>
                                </el-select>
                            </el-tooltip>
                            <!-- <el-input v-model="duwrtName1" size="mini" :title="duwrtName1" :disabled="disabledStatus"></el-input> -->
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </el-row>
    </div>
</template>

<script lang="ts">
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import * as moment from 'moment';
import { dateFormat, numberFormat } from '@/utils/tools';
import RiskInputNumber2 from '@/common/components/risk-input-number2.vue';
import { getUser } from '@/utils/user-util';

@Component({
    name: 'BondCalendarDetail',
    components: {
        RiskInputNumber2,
    },
})
export default class BondCalendarDetail extends Vue {
    numberFormat = numberFormat;
    dateFormat = dateFormat;
    @Prop() stockCode;

    // @Prop() bondDetailVisible;
    // @Prop() row;
    // @Prop() type; // 操作类型(新增、修改、查看)
    bondDetailInfo: any = {
        bidSectionLower: undefined,
        bidSectionUpper: undefined,
    };
    disabledStatus: boolean = true;
    queryLoading: boolean = false;
    private bondDetail: any = {};

    bidSubjectPojo: any = {
        '1': '利率',
        '3': '价格',
    };

    // 计息方式
    private payType = {
        '10': '零息',
        '20': '固定利率',
        '21': '浮动利率',
        '22': '递进利率',
        '99': '其他',
    };
    // private payType = {
    //     '0': '零息',
    //     '1': '周期性付息',
    //     '2': '到期一次行还本',
    //     '3': '贴息',
    // };
    // 付息频率
    private paymentMode = {
        '1': '按月付息',
        '2': '按季付息',
        '3': '半年付息',
        '4': '每年付息',
        '5': '到期一次还本付息',
        '99': '无',
    };
    // 利率类型
    private inType = {
        // '0': '零息',
        '1': '固定',
        '2': '浮动',
    };
    // 托管机构
    private localCustodian = {
        '0': '无',
        '1': '中债登托管',
        '2': '上清所托管',
    };
    // 招标方式
    private bidMode = {
        '1': '荷兰式',
        '2': '美国式',
        '3': '混合式',
        '4': '不招标',
        '5': '簿记建档',
        '6': '协议定价',
        '7': '报价发行',
        '99': '未披露',
    };
    // 主体行业分类
    // private issueType = {
    //     '11': '中央银行',
    //     '12': '政策性银行',
    //     '13': '商业银行',
    //     '21': '财政部',
    //     '22': '铁道部',
    //     '29': '其他部委',
    //     '31': '证券公司',
    //     '41': '信托公司',
    //     '51': '保险公司',
    //     '61': '其他非银行金融机构',
    // };
    private issueType = {
        '': '无',
        '001016': '中央银行',
        '001001': '政策性银行',
        '001002': '商业银行',
        '001003': '商业银行',
        '001005': '商业银行',
        '001006': '商业银行',
        '001007': '商业银行',
        '009003': '财政部',
        '008002': '其他部委',
        '009004': '其他部委',
        '005001': '证券公司',
        '002001': '信托公司',
        '003004': '保险公司',
    };
    sectionDisabledStatus: boolean = true;

    submitForm: any = {
        auth: true,
        bidEndDate: 0,
        bidEndTime: 0,
        bidMode: '',
        bidNo: '',
        bidRemainTime: '',
        bidSection: '',
        bidSectionLower: '',
        bidSectionUpper: '',
        bidStartDate: 0,
        bidStartTime: 0,
        bidSubject: '',
        bidType: '',
        bidingTime: 0,
        bondCode: '',
        bondNameSt: '',
        bondType: '',
        bondUpdateType: '',
        compGrade: '', // 主体评级
        compInnerGrade: '未评级', // 内部主体评级
        debtInnerRating: '未评级', // 内部债项评级
        debtRating: '', // 债项评级
        direactUser: getUser().userCode,
        directDate: Number(moment().format('YYYYMMDD')),
        directTime: 0,
        duwrtName: '',
        duwrtName1: [],
        duwrtName2: [],
        duwrtName3: [],
        duwrtType: '',
        enDate: 0,
        fundCode: '',
        fundName: '',
        fundNameSt: '',
        gradeComp: '',
        inStDate: 0,
        inType: '',
        instBalance: 0,
        instNo: '',
        instPrice: 0,
        instructionStatus: '',
        isBid: '',
        issueCode: '',
        issueName: '',
        issueNature: '',
        issueTerm: '',
        issueType: '',
        listDate: 0,
        localCustodian: '',
        marketCode: '',
        marketName: '',
        originOuterOrderCode: '',
        payDate: 0,
        payType: '',
        paymentMode: '',
        productCode: '',
        publishDate: 0,
        ratingOutlook: '未评级',
        serialNo: 0,
        summary: '',
        tenderWay: '',
        totalBalance: null,
        yearRate: null,
    };

    issueCodeList: any[] = []; // 发行人下拉数据
    dictGradeCode: any[] = []; // 评级信息
    allStockType: any[] = [];
    marketCodePojo: any[] = [
        {
            dictKey: '1',
            dictKeyName: '上交所A',
        },
        {
            dictKey: '2',
            dictKeyName: '深交所A',
        },
        {
            dictKey: '5',
            dictKeyName: '银行间',
        },
    ];
    duwrtName1: string = '';
    duwrtName2: string = '';
    duwrtName3: string = '';
    dictDuwrt: any[] = [];
    dictInnerGradeCode: any;
    issueType2: any[] = []; // 主体行业分类字典
    showIssueType: string = '';
    ratingOutlookPojo: any = {};
    dictCompInnerGrade: any[] = []; // 主体内部评级
    dictOuterIssue: any[] = []; // 主体外部评级机构

    @Watch('stockCode', { immediate: true })
    handle() {
        this.queryBondDetail();
    }

    async mounted() {
        this.queryDictInfo();
        this.queryInnerDictInfo();
        this.queryStockType();
        this.queryDruwt('');
        this.queryDictIssueType();
        this.queryDitratingOutlook();
        this.queryDictCompInnerGrade();
    }

    // 动态设置区间输入框class
    get computedClass() {
        if (this.bondDetailInfo?.bondUpdateType == '2') {
            return 'border-box';
        } else {
            return '';
        }
    }

    getInputNumber(args: any) {
        let value = args[0];
        let field = args[1];
        this.bondDetailInfo[field] = value;
        if (['bidSectionUpper', 'bidSectionLower'].includes(field)) {
            this.handleSectionChange();
        }
        this.$forceUpdate();
    }

    handleChangeBondCode(val: any) {
        // this.queryBondList(val);
    }

    handleSectionChange() {
        if (this.bondDetailInfo.bidSectionUpper && this.bondDetailInfo.bidSectionLower) {
            if (Number(this.bondDetailInfo.bidSectionLower) > Number(this.bondDetailInfo.bidSectionUpper)) {
                this.bondDetailInfo.bidSectionLower = undefined;
                this.bondDetailInfo.bidSectionUpper = undefined;
                this.yh_message_warn('区间下限不能大于区间上限，请重新输入！');
            }
        }
    }

    handleInputChange(val, field) {
        if (field == 'bondCode') {
            this.bondDetailInfo.bondCode = this.bondDetailInfo.bondCode.replace(/[^\w\s]/g, '');
        } else if (field == 'bondNameSt') {
            this.bondDetailInfo.bondNameSt = this.bondDetailInfo.bondNameSt.replace(/[^\w\u4e00-\u9fa5]/g, '');
        }
    }

    // 主承销商显示
    get showTip1() {
        if (this.bondDetailInfo.duwrtName1) {
            if (this.bondDetailInfo.duwrtName1.length) {
                return false;
            } else {
                return true;
            }
        } else {
            return true;
        }
    }

    handleMarketCodeChange(marketCode: any) {
        if (marketCode) {
            this.bondDetailInfo.marketName = this.marketCodePojo[marketCode];
        } else {
            this.bondDetailInfo.marketName = '';
        }
    }

    // 副承销商显示
    get showDuwrtName2() {
        let value = this.bondDetailInfo.duwrtName2;
        this.duwrtName2 = value && value.length && value.toString();
        console.log(this.duwrtName2, 'this.duwrtName2');

        return this.duwrtName2;
    }

    // 承销团显示
    get showDuwrtName3() {
        let value = this.bondDetailInfo.duwrtName3;
        this.duwrtName3 = value && value.length && value.toString();
        return this.duwrtName3;
    }

    // 获取发行主体title显示
    get showIssue() {
        let issue = this.issueCodeList.find(ele => ele.dictKey == this.bondDetailInfo.issueCode);
        if (issue) {
            return issue.dictKey + ' ' + issue.dictKeyName;
        }
        return '';
    }

    // 获取内部评级展望
    queryDitratingOutlook() {
        this.$axios
            .get('dict/list/code/Y_000022')
            .then((res: any) => {
                this.ratingOutlookPojo = res;
            })
            .catch(() => {
                this.ratingOutlookPojo = [];
            });
    }

    queryStockType() {
        this.$axios
            .get('/dict/getBondStockType', {})
            .then((res: any) => {
                this.allStockType = res;
            })
            .catch(() => {
                this.allStockType = [];
            });
    }

    // 获取发行人下拉数据
    queryIssueCodeList(val) {
        this.$axios
            .post('/dict/issue/select', {
                dictKey: val,
                dictKeyName: val,
            })
            .then((res: any) => {
                this.issueCodeList = res;
            })
            .catch(() => {
                this.issueCodeList = [];
            });
    }

    // 查询发行人信息
    getIssueInfo(val: string) {
        if (val) {
            this.$axios
                .get('/dict/issueInfo/' + this.bondDetailInfo.issueCode)
                .then((res: any) => {
                    this.bondDetailInfo.gradeComp = res.appraiseOrgan;
                    this.bondDetailInfo.issueType = res.issueType2;
                    this.bondDetailInfo.compGrade = res.outerGrade;
                    this.bondDetailInfo.compInnerGrade = res.innerGrade; // 主体内部评级

                    let issueType = this.issueType2.find(ele => ele.dictKey == this.bondDetailInfo.issueType);
                    this.showIssueType = '';
                    if (issueType) {
                        this.showIssueType = issueType.dictKey + ' ' + issueType.dictKeyName;
                    }

                    this.$forceUpdate();
                })
                .catch(() => {
                    this.bondDetailInfo.gradeComp = '';
                    this.bondDetailInfo.issueType = '';
                    this.bondDetailInfo.compGrade = '';
                    this.bondDetailInfo.compInnerGrade = '';
                });
        } else {
            this.bondDetailInfo.gradeComp = '';
            this.bondDetailInfo.issueType = '';
            this.bondDetailInfo.compGrade = '';
            this.bondDetailInfo.compInnerGrade = '';
            this.showIssueType = '';
        }
        this.queryIssueCodeList(val);
    }

    queryDictIssueType() {
        this.$axios
            .get('dict/list/code/Y_000053')
            .then((res: any) => {
                this.issueType2 = res;
            })
            .catch(() => {
                this.issueType2 = [];
            });
    }

    // 查询主体内部评级
    queryDictCompInnerGrade() {
        this.$axios
            .get('dict/list/code/Y_000023')
            .then((res: any) => {
                this.dictCompInnerGrade = res;
            })
            .catch(() => {
                this.dictCompInnerGrade = [];
            });
    }

    // 查询主体外部评级机构
    queryOuterIssue() {
        this.$axios
            .get('dict/list/code/Y_000133')
            .then((res: any) => {
                this.dictOuterIssue = res;
            })
            .catch(() => {
                this.dictOuterIssue = [];
            });
    }

    // 查询评级信息 --主体外部评级、债项外部评级
    queryDictInfo() {
        this.$axios
            .get('dict/list/code/Y_000248')
            .then((res: any) => {
                this.dictGradeCode = res;
            })
            .catch(() => {
                this.dictGradeCode = [];
            });
    }

    // 查询内部债项评级信息
    queryInnerDictInfo() {
        this.$axios
            .get('dict/list/code/Y_000059')
            .then((res: any) => {
                this.dictInnerGradeCode = res;
            })
            .catch(() => {
                this.dictInnerGradeCode = [];
            });
    }

    // 查询承销商
    queryDruwt(val: any) {
        this.$axios
            .post('dict/getDuwrt', {
                dictKey: val,
                dictKeyName: val,
            })
            .then((res: any) => {
                this.dictDuwrt = res;
            })
            .catch(() => {
                this.dictDuwrt = [];
            });
    }

    handleParam() {
        for (const key in this.bondDetailInfo) {
            if (
                [
                    'bidEndDate',
                    'bidEndTime',
                    'bidStartDate',
                    'bidStartTime',
                    'bidingTime',
                    'inStDate',
                    'enDate',
                    'listDate',
                    'payDate',
                    'publishDate',
                ].includes(key)
            ) {
                this.bondDetailInfo[key] = String(this.bondDetailInfo[key] || '');
            }
        }
    }

    private queryBondDetail(): void {
        this.$axios
            .get('/stockCalendar/stock/detail?stockCode=' + this.stockCode)
            .then((res: any) => {
                this.bondDetailInfo = res;
                this.handleParam();
                this.queryIssueCodeList(this.bondDetailInfo.issueCode);
            })
            .catch(() => {});
    }

    private queryBondList(val): void {
        this.$axios
            .get('/primaryBond/detail/Duwrt/' + val)
            .then((res: any) => {
                this.bondDetail = res;
                this.bondDetailInfo.duwrtName1 = res.duwrtName1;
                this.bondDetailInfo.duwrtName2 = res.duwrtName2;
                this.bondDetailInfo.duwrtName3 = res.duwrtName3;
            })
            .catch(() => {});
    }

    handleSujectChange() {
        this.bondDetailInfo.bidSectionLower = undefined;
        this.bondDetailInfo.bidSectionUpper = undefined;
        this.$forceUpdate();
    }

    formatterDuwrtName(value) {
        return value && value.length && value.toString();
    }

    private formatValue(value) {
        return value && value != '空' && (value + '').trim();
    }

    timeFormat4(str: string | number, completion?: boolean) {
        // if ((!str || str === '0') && !completion) {
        //     return '';
        // }
        let time;
        // if (completion && !str) {
        //     time = '';
        // } else {
        //     time = str.toString();
        // }
        time = str.toString();

        let time1 = time.length >= 6 ? time.substr(0, 4) : time;
        if (time.length < 4) {
            const addLen = 4 - time.length;
            for (let i = 0; i < addLen; i++) {
                time = '0' + time;
            }
            time1 = time;
        }
        return time1;
        // return moment(time1, 'HHmm').format('HH:mm');
    }
    test(val) {
        console.log(val, 'uuu');
    }

    handleVerify(form: any) {
        let verify = {
            bondCode: '债券代码',
            bondNameSt: '债券简称',
            bondType: '债券类型',
            // inType: '利率类型',
            issueTerm: '期限',
            totalBalance: '发行规模',
            bidSubject: '招标标的',
            // issueCode: '发行主体',
            // publishDate: '公告日期',
            listDate: '上市日期',
            bidStartDate: '投标开始日期',
            bidingTime: '投标开始时间',
            bidEndDate: '投标截止日期',
            bidEndTime: '投标截止时间',
            payDate: '缴款日期',
            inStDate: '起息日期',
        };
        for (const key in verify) {
            if (['bidingTime', 'bidEndTime'].includes(key)) {
                if (form[key] !== 0) {
                    if (!form[key]) {
                        this.yh_message_warn(verify[key] + ' 不可为空');
                        return false;
                    }
                }
            } else if (['bidEndDate', 'bidStartDate', 'inStDate', 'enDate', 'listDate', 'payDate', 'publishDate'].includes(key) && form[key] == 0) {
                this.yh_message_warn(verify[key] + ' 不可为空');
                return false;
            } else if (form[key] === '' || form[key] == undefined || form[key] == null) {
                this.yh_message_warn(verify[key] + ' 不可为空');
                return false;
            }
            if (key == 'bondCode' && form[key].length > 20) {
                this.yh_message_warn('债券代码长度不能超过20个字符');
                return false;
            } else if (key == 'bondNameSt' && form[key].length > 100) {
                this.yh_message_warn('债券简称长度不能超过100个字符');
                return false;
            }
            let marketChar = form.bondCode.split(' ')[1];
            let marketPojo = {
                SS: '1',
                SZ: '2',
                YH: '5',
            };
            if (form.marketCode && marketPojo[marketChar] != form.marketCode) {
                this.yh_message_warn('债券代码的后缀交易市场编码与选择的交易市场不匹配');
                return false;
            }
        }
        return true;
    }
    // // 重置表单
    // handleReset() {
    //     if (this.type == 'add') {
    //         this.bondDetailInfo = {};
    //         this.bondDetailInfo.bidSubject = '1';
    //         this.bondDetailInfo.totalBalance = '';
    //         this.bondDetailInfo.yearRate = '';
    //         this.bondDetailInfo.issueTerm = '';
    //         this.bondDetailInfo.bidSectionLower = undefined;
    //         this.bondDetailInfo.bidSectionUpper = undefined;
    //         this.$set(this.bondDetailInfo, 'bidSectionLower', undefined);
    //     } else {
    //         this.row.bidEndTime = this.row.bidEndTime ? this.timeFormat4(this.row.bidEndTime) : '';
    //         this.row.bidingTime = this.row.bidingTime ? this.timeFormat4(this.row.bidingTime) : '';
    //         this.row.duwrtName1 = this.bondDetail.duwrtName1;
    //         this.row.duwrtName2 = this.bondDetail.duwrtName2;
    //         this.row.duwrtName3 = this.bondDetail.duwrtName3;
    //         this.bondDetailInfo = JSON.parse(JSON.stringify(this.row));
    //     }
    //     console.log(this.bondDetailInfo, 'this.bondDetailInfo.bidSectionLower');

    //     this.$forceUpdate();
    // }

    // 债券操作
    // private handleOperateBond() {
    //     console.log(this.bondDetailInfo, ' kkkkk');

    //     for (const key in this.submitForm) {
    //         if (this.bondDetailInfo[key] !== undefined) {
    //             this.submitForm[key] = this.bondDetailInfo[key];
    //             if (key == 'yearRate') {
    //                 this.submitForm.yearRate = this.submitForm.yearRate / 100;
    //             }
    //         }
    //     }

    //     for (const key in this.submitForm) {
    //         if (
    //             [
    //                 'bidEndDate',
    //                 'bidStartDate',
    //                 'inStDate',
    //                 'enDate',
    //                 'instBalance',
    //                 'instPrice',
    //                 'listDate',
    //                 'payDate',
    //                 'publishDate',
    //                 // 'yearRate',
    //                 // 'totalBalance',
    //             ].includes(key)
    //         ) {
    //             this.submitForm[key] = Number(this.submitForm[key] || '');
    //         }
    //         if (['bidEndTime', 'bidStartTime', 'bidingTime'].includes(key)) {
    //             if (this.submitForm[key] && this.submitForm[key].indexOf(':') !== '-1') {
    //                 this.submitForm[key] = Number(this.submitForm[key].replace(':', ''));
    //             }
    //         }
    //     }
    //     if (this.submitForm.bidSectionLower == undefined) {
    //         this.submitForm.bidSectionLower = '';
    //     }
    //     if (this.submitForm.bidSectionUpper == undefined) {
    //         this.submitForm.bidSectionUpper = '';
    //     }
    //     if (this.type !== 'updateBid') {
    //         let verInt = this.handleVerify(this.submitForm);
    //         if (!verInt) {
    //             return;
    //         }
    //     }
    //     console.log(this.submitForm, 'lllll');

    //     let message: string = '';
    //     if (this.type == 'add') {
    //         delete this.submitForm.bondUpdateType;
    //         message = '新增成功';
    //     } else if (this.type == 'updateBond') {
    //         this.submitForm.bondUpdateType = '1';
    //         message = '修改债券成功';
    //     } else if (this.type == 'updateBid') {
    //         this.submitForm.bondUpdateType = '2';
    //         message = '修改标位成功';
    //     }
    //     this.$axios
    //         .post('/primaryBond/bondOperate', this.submitForm)
    //         .then(res => {
    //             this.yh_message_success(message);
    //             this.closeDialog();
    //             this.$emit('getPrimaryBondList');
    //         })
    //         .catch(() => {});
    // }

    // closeDialog() {
    //     this.$emit('closeBondDetailDialog');
    // }
}
</script>

<style lang="scss" scoped>
.label-icon {
    border: 1.5px solid #595959;
    border-radius: 50%;
    line-height: 12px;
    font-size: 12px;
    display: inline-block;
    padding: 0 3px;
}
.popper {
    height: 40px;
    float: right;
    margin-right: -20px;
}
.suffix-box {
    /deep/ .el-input__inner {
        padding: 0 5px !important;
    }
}
.title {
    display: inline-block;
    padding-left: 30px;
    .title-item {
        padding-right: 30px;
        font-size: 18px;
    }
}
.border-box {
    /deep/.el-input__inner,
    /deep/.el-input-group__append {
        border-color: red;
    }
    border-color: red !important;
    /deep/.el-input-number--mini .el-input-number__decrease,
    /deep/.el-input-number--mini .el-input-number__increase {
        border-left-color: red;
    }
}
.input-suffix {
    width: 45%;
    display: inline-flex;
}
.suffix-box1 {
    display: inline-block;
    width: 30px;
    text-align: center;
    height: 32px;
    line-height: 28px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    margin-left: -2px;
    background: #f3f6fe;
    color: #575757;
}
.connect-line {
    width: 9px;
    display: inline-block;
    height: 1.5px;
    background: #575757;
    margin: 0 5px;
    vertical-align: middle;
}
/deep/.el-input__icon {
    line-height: 42px !important;
}
/deep/.el-input-group {
    vertical-align: middle !important;
    display: flex;
}
/deep/ .el-input-group__append {
    padding: 0 15px;
    line-height: 25px;
    display: flex;
    justify-content: center;
}

.icon-prefix {
    color: red;
    margin-right: 2px;
    padding-top: 10px;
    font-size: 16px;
}
/deep/ .el-select__tags {
    flex-wrap: nowrap;
}

/deep/ span.el-tag.el-tag--info.el-tag--mini.el-tag--light {
    display: flex;
    align-items: center;
    .el-select__tags-text {
        display: inline-block;
        max-width: 60px !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
/deep/ .el-input.is-disabled .el-input__inner {
    height: 32px;
    line-height: 32px !important;
    color: #555 !important;
}
/deep/ .el-form-item {
    margin-bottom: 5px;
}
/deep/ .el-divider--horizontal {
    margin: 10px 0;
}
/deep/ .el-dialog .el-dialog__body .el-form-item__label {
    padding: 0px;
}
.detail {
    // width: 1240px;
}
// /deep/ .el-dialog {
//     width: fit-content;
//     .el-dialog__body {
//         width: 1240px !important;
//         padding: 10px;
//         max-height: 100vh !important;
//     }
// }
// /deep/.el-dialog__body {
//     width: 1240px !important;
//     padding: 10px !important;
//     max-height: 100vh !important;
// }
// }
</style>
